<template>
  <div id="log-detail">
      <p class="item">操作账号：{{detailData.loginName}}</p>
      <p class="item">操作模块：{{detailData.modelName}}</p>
      <p class="item">IP：{{detailData.ip}}</p>
      <p class="item">地理位置：{{detailData.address}}</p>
      <p class="item">操作状态：{{detailData.status}}</p>
      <p class="item">操作时间：{{detailData.createDate}}</p>
      <p class="item row">请求地址：{{detailData.requestUrl}}</p>
      <p class="item">请求参数：
        <code><pre>{{detailData.params}}</pre></code>
      </p>
  </div>
</template>
<script>
export default {
    props:{
      initData:{
        type:Object,
        default:()=>{},
        required:false,
      },
    },
    data(){
      return{
         detailData:{}
      }
    },
    watch:{
      initData(newVal){
      this.detailData=newVal
        var params=newVal.requestParam
        this.detailData.params=JSON.parse(params)

      }
    },
};
</script>
<style scoped lang="scss">
#log-detail{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding:10px 20px;
  .item{
    flex-basis: 40%;
    margin:10px;
    &.row{
      flex-basis: 90%;
    }
  }

}
</style>
